<!--
 * @Author: libing 9852442+liu-sheng-8667@user.noreply.gitee.com
 * @Date: 2024-04-12 22:29:37
 * @LastEditors: xuezhuangzhuang xzz6996@qq.com
 * @LastEditTime: 2025-06-23 22:06:32
 * @FilePath: \crm\pages\customer\order-list.vue
 * @Description: 订单列表
-->
<template>
  <view class="my-customer">
    <u-navbar title="订单列表" :autoBack="true" bgColor="transparent" />
    <view class="search-wrap">
      <u-search
        placeholder="请输入手机号进行搜索"
        v-model="phone"
        bgColor="#FFFFFF"
        height="74rpx"
        placeholderColor="#C1C5C9"
        :showAction="false"
        @change="upper"
      />
      <div style="margin-top: 10px">
        <u-subsection
          :list="list1"
          :current="current"
          @change="sectionChange"
        ></u-subsection>
      </div>
    </view>
    <view class="bg"></view>
    <scroll-view
      scroll-y="true"
      class="scroll-Y"
      @scrolltoupper="upper"
      @scrolltolower="lower"
    >
      <!-- 无限滚动列表 -->
      <view v-for="(item, index) in list" :key="index">
        <OrderItem :item="item" :current="current" />
      </view>
      <u-loadmore iconType="circle" :status="status" />
    </scroll-view>
  </view>
</template>
<script>
import OrderItem from "./conponents/order-item.vue";
import listPageMixins from "./mixins/scroll-list";
import { getOrderList, listMallOrderPageTraft } from "@/apis/order/index";
export default {
  name: "my-customer",
  components: {
    OrderItem,
  },
  mixins: [listPageMixins],
  data() {
    return {
      queryAPI: getOrderList,
      phone: "",
      defaltParams: {
        score: 1,
      },
      list1: ["全部", "未提交", "未支付", "已支付", "已取消"],
      payStatus: null,
      current: 0,
      orderStatus: ''
    };
  },
  mounted() {
    this.getList();
  },
  methods: {
    sectionChange(index) {
      this.queryAPI = getOrderList;
      this.current = index;
      this.orderStatus = null;
      if (index == 0) {
        this.payStatus = null;
      } else if (index == 2) {
        this.payStatus = 1;
      } else if (index == 3) {
        this.payStatus = 2;
      } else if (index == 4) {
        // this.payStatus = 3;
        this.orderStatus = '8';
      } else if (index == 1) {
        this.queryAPI = listMallOrderPageTraft;
      }
      this.upper();
    },
  },
};
</script>
<style scoped lang="scss">
.scroll-Y {
  height: calc(100vh - 300rpx);
}
.my-customer {
  height: 100vh;
  padding: 0 18rpx;
  background: #f2f4f5;
  .bg {
    height: 659rpx;
    background: linear-gradient(#f4eae9 0%, #f4e9e8 10%, #f2f4f5 100%);
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
  }
}
.search-wrap {
  margin-bottom: 20rpx;
  position: relative;
  z-index: 100;
}
</style>
